const renderStorage = function() {
    // log kuai_tool
    showCurrentElement('#console-storage')
    handleStorageContent()
}

const getCookie = function() {
    let ca = document.cookie.split(';')
    let cookieMap = {}
    for (var i = 0; i < ca.length; i++) {
        var c = ca[i].trim()
        let arr = c.split('=')
        let key = arr[0]
        let value = arr[1]
        cookieMap[key] = value
        renderStorageTemplate('cookie-info', key, value)
    }
}

const handleStorageCookie = function() {
    e('.cookie-info').innerHTML = ''
    getCookie()
}

const handleStorageSession = function() {
    e('.session-info').innerHTML = ''

    let sessionKeys = Object.keys(sessionStorage)
    for (var i = 0; i < sessionKeys.length; i++) {
        //可以对key 进行分析从而决定是否要删除sessionStorage 里的缓存
        let key = sessionKeys[i]
        let value = sessionStorage.getItem(key)
        renderStorageTemplate('session-info', key, value)
    }
}

const handleStorageLocal = function() {
    e('.local-info').innerHTML = ''

    let sessionKeys = Object.keys(localStorage)
    for (var i = 0; i < sessionKeys.length; i++) {
        //可以对key 进行分析从而决定是否要删除sessionStorage 里的缓存
        let key = sessionKeys[i]
        let value = localStorage.getItem(key)
        log(170, key, value)
        renderStorageTemplate('local-info', key, value)
    }
}

const renderStorageTemplate = function(ele = 'cookie-info', key, value) {
    if (key.length > 12) {
        key = key.slice(0, 12)
    }
    let temp = `
    <div class="table-storage">
        <div class="item-storage">${key}</div>
        <div class="item-storage">${value}</div>
        <div class="item-storage"></div>
    </div>
    `
    let tabInfo = e('#console-storage').querySelector(`.${ele}`)
    // log(179, e('#console-storage'), tabInfo)
    tabInfo.innerHTML += temp
}

const handleStorageContent = function() {
    const storageMap = {
        'storage-cookies': 'cookie-info',
        'storage-sessionstorage': 'session-info',
        'storage-localstorage': 'local-info',
    }
    const storageFuncMap = {
        'storage-cookies': handleStorageCookie,
        'storage-sessionstorage': handleStorageSession,
        'storage-localstorage': handleStorageLocal,
    }
    e('#console-storage').addEventListener('click', event => {
        let target = event.target
        let parent = target.parentNode
        // contains(document.body)
        let tid = target.getAttribute('id')
        if (tid) {
            if (target?.classList.contains('storage-head-active')) {
                return
            } else {
                let storages = es('.storage-info')
                let sName = storageMap[tid]
                storages.forEach(item => {
                    // log(122, item)
                    if (item.classList && item.classList.contains(sName)) {
                        item.classList.remove('none-show')
                    } else {
                        item.classList.add('none-show')
                    }
                })
                removeChildClassName(parent, 'storage-head-active')
                target.classList.add('storage-head-active')
                // handle storage
                storageFuncMap[tid]()
            }
        }
    })
}

